import * as React from "react";
import { SVGProps } from "react";

export const ArrowUnionIcon = (props: SVGProps<SVGSVGElement>) => (
    <svg
        xmlns="http://www.w3.org/2000/svg"
        width={16}
        height={16}
        viewBox="0 0 16 16"
        fill="none"
        {...props}
    >
        <path
            fill="#303450"
            stroke="url(#arrow-union-icon)"
            d="M.5 8.495V15.5h15V8.495a4.5 4.5 0 0 1-3.816-2.483L9.341 1.33c-.553-1.105-2.13-1.105-2.683 0L4.317 6.012A4.5 4.5 0 0 1 .5 8.495Z"
        />
        <defs>
            <linearGradient
                id="arrow-union-icon"
                x1={8}
                x2={8}
                y1={0}
                y2={10}
                gradientUnits="userSpaceOnUse"
            >
                <stop stopColor="#474E6B" />
                <stop offset={0.9} stopColor="#474E6B" />
                <stop offset={0.901} stopColor="#474E6B" stopOpacity={0} />
            </linearGradient>
        </defs>
    </svg>
);
